import React from 'react';
import { Col, Row } from 'antd';

export const RealGrid = ({ rows, columns, itemIds, children, ...props }) => {
  return (
    <div style={{ paddingBottom: '20px' }}>
      <Row {...props}>
        {itemIds.map((id, index) => (
          <Col key={id} span={24 / columns}>
            {children[index]}
          </Col>
        ))}
      </Row>
    </div>
  );
};

export const RealGridColWrapper = ({ textAlign, children }) => {
  return <div style={{ textAlign }}>{children}</div>;
};
